let y = document.createElement("audio");


class OpenState extends fsm.State {

    private textField: renderer.TextField;

    private startpicture: renderer.Bitmap;

    private onClick = (eventData: any) => {

        gameFsm.replaceState(new LoginState());
    }
    onEnter() {
        y.src = "menue.mp3";
        y.play();
        y.loop = true;
        const img = new Image();
        img.src = "封面2.png"
        const Bitmap = new renderer.Bitmap(0, 0, img);
        this.startpicture = Bitmap;
        stage.addChild(this.startpicture);
        stage.addEventListener("click", this.onClick);

    }
    onExit() {
        stage.removeEventListener("click", this.onClick);
        stage.removeChild(this.startpicture);
    }
}

class LoginState extends fsm.State {

    private textField: renderer.TextField;

    private startpicture: renderer.Bitmap;




    private onClick = (eventData: any) => {
        this.createUser();
        y.pause();
        const x = document.createElement("audio");
        x.src = "gameBGM.mp3";
        x.play();
        x.loop = true;
        gameFsm.replaceState(new PlayingState());
    }
    // private onClick2 = (eventData: any) => {
    //     this.update();
    //     this.i = this.i + 1;
    // }

    public createUser() {
        user = new User();
        user.level = 1;
        user.name = 'Player';
        user.rolePicture.src = 'assets/role/stand.png';


        user.picture = new renderer.Flash(0, 0, user.rolePicture, user.rolePicture)

        user.view.addChild(user.picture);

        missionManager.init();



        console.log(user.toString())
    }
    onEnter() {

        const img = new Image();
        img.src = "introduction.png"
        const Bitmap = new renderer.Bitmap(0, 0, img);
        this.startpicture = Bitmap;
        stage.addChild(this.startpicture);
        stage.addEventListener("click", this.onClick);


    }



    onExit() {
        stage.removeEventListener("click", this.onClick);
        stage.removeChild(this.startpicture);
    }
}

/**
 * 用户面板 UI 界面
 * MVC:View
 */
class UserPanelUI extends renderer.DisplayObjectContainer {

    constructor() {
        super();
        const userNameLabel = new renderer.TextField(0, 0);
        this.addChild(userNameLabel);
        const userLevelLabel = new renderer.TextField(50, 0);
        this.addChild(userLevelLabel);

        const userAttackLabel = new renderer.TextField(100, 0);
        this.addChild(userAttackLabel);

        userLevelLabel.text = "lv:" + user.level;
        userNameLabel.text = user.name;
        //   userAttackLabel.text = "attack:" + user.attack;

        user.addEventListener("userchange", () => {
            userLevelLabel.text = "lv:" + user.level;
            userNameLabel.text = user.name;
            //       userAttackLabel.text = "attack:" + user.attack;
        })
    }
}


let dialogContainer: renderer.DisplayObjectContainer
let viewContainer: renderer.DisplayObjectContainer
let viewContainer2: renderer.DisplayObjectContainer

class PlayingState extends fsm.State {
    private fsm = new fsm.StateMachine();

    onEnter() {


        const map = mapManager.getMap();
        const mapContainer = new renderer.DisplayObjectContainer();
        mapManager.initContainer(mapContainer);
        const missionPanel = new MissionPanel();
        const uicontainer = new renderer.DisplayObjectContainer();
        const userPanel = new UserPanelUI();
        dialogContainer = new renderer.DisplayObjectContainer();
        viewContainer = new renderer.DisplayObjectContainer();
        viewContainer2 = new renderer.DisplayObjectContainer();
        // user.packegedContainer = new renderer.DisplayObjectContainer();


        stage.addChild(mapContainer);
        stage.addChild(uicontainer)

        uicontainer.addChild(userPanel);
        uicontainer.addChild(missionPanel);


        uicontainer.addChild(mapManager.viewContaner);
        uicontainer.addChild(user.bagToolContainer);
        uicontainer.addChild(user.buttonToolContainer);
        uicontainer.addChild(user.CheckBigContainer);


        uicontainer.addChild(viewContainer2);
        uicontainer.addChild(viewContainer);
        uicontainer.addChild(dialogContainer);

        // uicontainer.addChild(user.buttonToolContainer);
        // uicontainer.addChild(user.chosenContainer);

        // map.addToRoleContainer(user.view)
        // map.grid.setStartNode(0, 0);
        missionPanel.x = 250;
        missionPanel.y = 100;
        // mapContainer.x = mapContainer.y = 30;
        // map.x = map.y = 30;
        // map.x = map.y = 30;

        user.bagToolContainer.x = 13 * TILE_SIZE;
        user.bagToolContainer.y = 0;

        mapManager.changeMap(3, 4, 0);






    }



    onUpdate() {

        user.update();

    }
}



let pool = new command.CommandPool();
let user: User;
// let map: GameMap;
gameFsm.replaceState(new OpenState());


function loadConfig(url: string, callback: Function) {
    const loader = new XMLHttpRequest();
    loader.open("get", url);
    loader.send();
    loader.onload = () => {
        const obj = JSON.parse(loader.response);
        callback(obj);
    }
}


loadConfig("assets/config/npc.json", (obj: any) => {
    npcManager.parseFromConfig(obj);
    loadConfig("assets/config/mission.json", (obj: any) => {
        missionManager.parseFromConfig(obj);
        loadConfig("assets/config/tool.json", (obj: any) => {
            toolManager.parseFromConfig(obj)
            loadConfig("assets/config/tile.json", (obj: any) => {
                tileManager.parseFromConfig(obj)
                loadConfig("assets/config/gameaside.json", (obj: any) => {
                    gameAsideManager.parseFromConfig(obj)
                    //     loadConfig("assets/config/map2.json", (obj: any) => {
                    //         mapManager.parseFromConfig("map2", obj)
                    loadConfig("assets/config/map.json", (obj: any) => {
                        mapManager.parseFromConfig(obj)

                    })
                })
                // })
            })
        })
    })
})